<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>时间范围选择</title>
<link rel="stylesheet" href="../../Content/css/bootstrap.min.css" />
<link rel="stylesheet" href="../../Content/css/font-awesome.min.css" />
<link rel="stylesheet" href="../../Content/css/daterangepicker-bs3.css"/>
<link rel="stylesheet" href="../../Content/css/base.css" />

</head>

<body>
 <div class="input-group">
   <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
   <input type="text" readonly style="width: 250px" name="reservation" id="reservation" class="form-control" value="2014-5-21 至 2014-6-21" /> 
 </div>

<script src="../../Scripts/jquery.min.js"></script>
<script src="../../Scripts/bootstrap.min.js"></script>
<script src="../../Scripts/moment.js"></script>
<script src="../../Scripts/daterangepicker.js"></script>
<script>
	$(function(){
		$('#reservation').daterangepicker(null, function(start, end, label) {
			console.log(start.toISOString(), end.toISOString(), label);
		});
	})
</script>

</body>
</html>
